<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>管理员操作</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" th:href="@{/layui/dist/css/view.css}"/>
    <link rel="stylesheet" th:href="@{/layui/dist/css/layui.css}"  media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/bootstrap.min.css}">
</head>
<body class="layui-view-body">
<div class="layui-content">
    <div class="layui-page-header">
        <div class="pagewrap">
            <div class="pagewrap" style="height: 80px;">
                <div style="margin-left: 50px;margin-top: 30px;">
                    <font size="6">用户信息</font>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="form-box">
                    <form th:action="@{/userList}">
                        <div class="layui-form layui-form-item" style="float: left">
                            <div class="layui-inline">
                                <div class="layui-form-mid">用户姓名:</div>
                                <div class="layui-input-inline" style="width: 120px;">
                                    <input type="text" autocomplete="off" class="layui-input" name="name">
                                </div>
                                <div class="layui-form-mid">性别:</div>
                                <div class="layui-input-inline" style="width: 85px;">
                                    <select  name="userSex">
                                        <option value="">请选择</option>
                                        <option th:selected="${userSex == '1'}" value="1">男</option>
                                        <option th:selected="${userSex == '2'}" value="2">女</option>
                                    </select>
                                </div>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                <div class="layui-form-mid">所属部门:</div>
                                <div class="layui-input-inline" style="width: 130px;">
                                    <select  name="userDep">
                                        <option value="">请选择</option>
                                        <option th:selected="${userDep == '1'}" value="1">总经理办公室</option>
                                        <option th:selected="${userDep == '2'}" value="2">人力资源部</option>
                                        <option th:selected="${userDep == '3'}" value="3">财务部</option>
                                        <option th:selected="${userDep == '4'}" value="4">生产技术部</option>
                                        <option th:selected="${userDep == '5'}" value="5">计划营销部</option>
                                        <option th:selected="${userDep == '6'}" value="6">安全监察部</option>
                                        <option th:selected="${userDep == '7'}" value="7">后勤部</option>
                                    </select>
                                </div>
                                <div class="layui-form-mid">用户状态:</div>
                                <div class="layui-input-inline" style="width: 85px;">
                                    <select  name="userState">
                                        <option value="">请选择</option>
                                        <option th:selected="${userState == '1'}" value="1">启用</option>
                                        <option th:selected="${userState == '2'}" value="2">禁用</option>
                                    </select>
                                </div>
                                <button class="layui-btn layui-btn-blue" type="submit">查询</button>
                            </div>
                        </div>
                    </form>
                    <div style="width: 100px;float: left;">
                        <button class="layui-btn layui-btn-blue" onclick="downloadfile()"> 导出信息</button>
                    </div>
                    <table class="layui-table">
                        <colgroup>
                            <col width="150">
                            <col width="130">
                            <col>
                        </colgroup>
                        <thead>
                        <tr>
                            <th>员工编号</th>
                            <th>员工姓名</th>
                            <th>性别</th>
                            <th>年龄</th>
                            <th>所属部门</th>
                            <th>入职时间</th>
                            <th>联系方式</th>
                            <th>用户状态</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="user:${list}">
                            <td th:text="${user.username}">员工编号</td>
                            <td th:text="${user.name}">员工姓名</td>
                            <td th:text="${user.userSex} == '1' ? '男' : '女'">性别</td>
                            <td th:text="${user.age}">年龄</td>
                            <td th:text="${user.userDep} == '1' ? '总经理办公室'
                                : (${user.userDep} == '2' ? '人力资源部'
                                : (${user.userDep} == '3' ? '财务部'
                                : (${user.userDep} == '4' ? '生产技术部'
                                : (${user.userDep} == '5' ? '计划营销部'
                                : (${user.userDep} == '6' ? '安全监察部' : '后勤部'
                                )
                                )
                                )
                                )
                                )
                                ">所属部门</td>
                            <td th:text="${#dates.format(user.userTime,'yyyy-MM-dd')}">入职时间</td>
                            <th th:text="${user.userTel}">联系方式</th>
                            <td th:text="${user.userState} == '1' ? '启用' : '禁用'">用户状态</td>
                            <td>
                                <button class="layui-btn layui-btn-sm" type="button" th:onclick="'showUserDetail(' +${user.id} + ')'">查看详情</button>
                                <a class="layui-btn layui-btn-sm layui-btn-normal" th:if="${user.userState} == 2" th:href="@{/updateUser(id=${user.id})}" >启用</a>
                                <a class="layui-btn layui-btn-sm layui-btn-warm" th:if="${user.userState} == 1" th:href="@{/modifyUser(id=${user.id})}">禁用</a>
                                <button class="layui-btn layui-btn-sm layui-btn-danger" type="button" th:onclick="'deletefm(' +${user.id} + ')'">删除</button>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    <!--分页导航-->
                    <div class="pagination center pagination-large pt-20" style="margin-left: 30%">
                        <div class="row text-center">
                            <div class="col-md-12">
                                <ul class="pagination">
                                    <li><a th:class="${currentPage eq 1 ? 'btn disabled' : '' }" href="javascript:;" th:href="@{/userList(page=1,name=${name},userSex=${userSex},userDep=${userDep})}">首页</a></li>
                                    <li><a th:class="${currentPage eq 1 ? 'btn disabled' : '' }" href="javascript:void(0);" th:href="@{/userList(page=${currentPage}-1,name=${name},userSex=${userSex},userDep=${userDep})}">&laquo;</a></li>

                                    <li th:class="${page eq currentPage} ? 'active' : ''" th:each="page:${#numbers.sequence(1,totalPage)}">
                                        <a href="javascript:void(0);" th:href="@{/userList(page=${page},name=${name},userSex=${userSex},userDep=${userDep})}" th:text="${page}">1</a>
                                    </li>

                                    <li><a th:class="${currentPage eq totalPage ? 'btn disabled' : '' }" href="javascript:void(0);" th:href="@{/userList(page=${currentPage}+1,name=${name},userSex=${userSex},userDep=${userDep})}">&raquo;</a></li>
                                    <li><a th:class="${currentPage eq totalPage ? 'btn disabled' : '' }" href="#" th:href="@{/userList(page=${totalPage},name=${name},userSex=${userSex},userDep=${userDep})}" style="border: 1px solid #ddd;">尾页</a></li>
                                    <li><a style="border: 0px;margin-left: 0px;">当前页<span th:text="${currentPage}"></span>/<span th:text="${totalPage}"></span>总页</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script th:src="@{/layui/dist/layui.all.js}" charset="utf-8"></script>
<script th:src="@{/js/jquery.min.js}" charset="utf-8"></script>
<script>
    //弹出层 显示用户详细信息
    function showUserDetail(id){
        layer.open({
            //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
            type:2,
            title:"用户详细信息",
            area: ['80%','80%','left:126px'],
            content:'/booksystem/jumpToModifyUser?id=' + id,

                end: function () {
                    window.location.reload();
                }

        });

    }

    //询问层 删除用户
    function deletefm(id) {
        //询问框
        layer.confirm('确认要删除？', {
            btn: ['确定','取消'] //按钮
        }, function(){
            //发送ajax异步删除
            $.ajax({
                ////
                url : '/booksystem/deleteUser?id=' + id,
                method :'post',
                data : {id:id},
                success : function (data) {
                    layer.msg('删除成功', {icon: 1},function () {
                        //重新加载页面
                        layer.load(1);
                        window.location.reload(true);
                    });
                }
            })
        }, function(){
            // layer.alert("取消删除");
        });
    }

    //导出信息
    function downloadfile() {
        window.location.href = "/booksystem/loadSysUser";
    }
</script>

</body>
</html>
